.palette {
  width: 360px;
  box-sizing: border-box;
  padding: 16px;
}
.miyue-sql-task {
  background-image: url('/icons/mysql.png');
  background-size: 1em 1em;
  background-position: center center;
  background-repeat: no-repeat;
}

.bpmn-sty {
  background-image: url('/icons/sty.jpeg');
  background-size: 1em 1em;
  background-position: center center;
  background-repeat: no-repeat;
}

.djs-palette-entries {
  .entry {
    position: relative;

    &:hover {
      &:after {
        width: max-content;
        content: attr(title);
        vertical-align: text-bottom;
        position: absolute;
        right: -10px;
        top: 0;
        bottom: 0;
        overflow: hidden;
        transform: translateX(100%);
        font-size: 0.5em;
        display: inline-block;
        text-decoration: inherit;
        font-variant: normal;
        text-transform: none;
        background: #fafafa;
        box-shadow: 0 0 6px #eeeeee;
        border: 1px solid #cccccc;
        box-sizing: border-box;
        padding: 0 16px;
        border-radius: 4px;
        z-index: 100;
      }
    }
  }
}
